<script>
  import { fade, fly } from "svelte/transition";
  let show = true;
  const toggleShowHide = () => {
    show = !show;
  };
</script>

<main>
  <p>
    <button on:click={toggleShowHide}>显示/隐藏</button>
  </p>
  {#if show}
    <p transition:fade>一些文字</p>
    <!-- <p transition:fly={{ y: 200, duration: 1000 }}>二些文字</p> -->
    <p in:fly={{ y: 200, duration: 1000 }} out:fade>二些文字</p>
    <p in:fly={{ y: 200, duration: 1000 }} out:fade>三些文字</p>
  {/if}
</main>
